<table class="table table-bordered">
    <table class="table table-bordered">
        <tbody>
        <tr>
            <td style="width: 5cm;text-align: center;">申请人</td>
            <td><input type="text" class="form-control" required name="person" style="text-align: center"/></td>
            <td style="width: 5cm;text-align: center;">申请部门</td>
            <td><input type="text" class="form-control" required name="department"/></td>
            <td></td>
        </tr>
        <tr>
            <td style="width: 5cm;text-align: center;">姓名</td>
            <td style="width: 5cm;text-align: center;">所在部门</td>
            <td style="width: 5cm;text-align: center;">岗位</td>
            <td style="width: 5cm;text-align: center;">入职日期</td>
            <td style="width: 5cm;text-align: center;">申请日期</td>
        </tr>
        <tr>
            <td><input type="text" class="form-control" required name="name"/></td>
            <td><input type="text" class="form-control" required name="department1"/></td>
            <td><input type="text" class="form-control" required name="post"/></td>
            <td><input type="text" class="form-control" required id="createTime" name="createTime"/></td>
            <td><input type="text" class="form-control"  required  id="applyTime" name="applyTime"/></td>
        </tr>
        <tr>
            <td style="text-align: center">申报性质</td>
            <td colspan="8" class='form-inline' >&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <label><input  type="checkbox" class="form-control" value="jinsheng" name="jinsheng" />&nbsp;&nbsp; 晋升</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <label><input  type="checkbox" class="form-control" value="tiaozhi" name="tiaozhi"/>&nbsp;&nbsp;调职</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <label><input  type="checkbox" class="form-control" value="jiangzhi" name="jiangzhi"/>&nbsp;&nbsp;降职</label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                <label><input  type="checkbox" class="form-control" value="xinjin" name="xinjin" />&nbsp;&nbsp;薪金调整</label>
            </td>
        </tr>
        <tr>
            <td style="width: 5cm;text-align: center;">变动详情</td>
            <td style="width: 5cm;text-align: center;">由</td>
            <td style="width: 5cm;text-align: center;">至</td>
            <td style="text-align: center;" colspan="2">异动原因</td>
        </tr>
        <tr>
           <tr> <td style="width: 5cm;text-align: center;">事业部</td>
            <td><input type="text" class="form-control" name="shiyebu1"/></td>
            <td><input type="text" class="form-control" name="shiyebu2"/></td>
            <td colspan="2" rowspan="6"><textarea  maxlength="207" class="form-control"  name="details"  style="height: 8cm"></textarea></td>
         </tr>
        <tr> <td style="width: 5cm;text-align: center;">部门</td>
            <td><input type="text" class="form-control" name="bumen1"/></td>
            <td><input type="text" class="form-control" name="bumen2"/></td>
           </tr>
        <tr> <td style="width: 5cm;text-align: center;">岗位</td>
            <td><input type="text" class="form-control" name="gangwei1"/></td>
            <td><input type="text" class="form-control" name="gangwei2"/></td>
        </tr>
        <tr> <td style="width: 5cm;text-align: center;">职级</td>
            <td><input type="text" class="form-control" name="zhiji1"/></td>
            <td><input type="text" class="form-control" name="zhiji2"/></td>
        </tr>
        <tr> <td style="width: 5cm;text-align: center;">薪金</td>
            <td><input type="text" class="form-control" name="xinji1"/></td>
            <td><input type="text" class="form-control" name="xinji2"/></td>
        </tr>
        <tr> <td style="width: 5cm;text-align: center;">其他</td>
            <td><input type="text" class="form-control" name="qita"/></td>
            <td><input type="text" class="form-control" name="qita2"/></td>
        </tr>
        </tr>
        <tr> <td style="width: 5cm;text-align: center;">生效日期</td>
            <td colspan="2"><input type="text" class="form-control"  oninvalid="setCustomValidity('时间不允许为空')" id="takeTime" name="takeTime" style="width: 5.7cm" /></td>
            <td style="width: 5cm;text-align: center;"colspan="2" class='form-inline'>员工签名：<input type="text" class="form-control"required name="autograph" style="width: 6cm"/></td>
        </tr>
        <tr> <td style="width: 5cm;" colspan="8"><a style="color:red;">注：总监有权授权副总监代为审批同意。</a></td>
        </tr>

        </tbody>

    </table>
</table>

<script>
    layui.use('laydate', function(){
        var laydate = layui.laydate;
        laydate.render({
            elem: '#createTime'
        });

        laydate.render({
            elem: '#applyTime'
        });
        laydate.render({
            elem: '#takeTime'
        });
        laydate.render({
            elem: '#repairCreateTime'
        });
    });

    // $("#demo").on("input",function(){
    //     var realHeight = document.getElementById("demo").scrollHeight;
    //     document.getElementById("demo").scrollTop=realHeight;
    //     if($(this).scrollTop>0){
    //         alert("超过了")
    //         //TODO:超过行数
    //     }else{
    //         //TODO:没有超过行数
    //     }
    // });

    /**
     * 重写表单提交前事件
     * @returns {boolean}
     */
    function preSubmit() {
        console.log('重写表单提交前事件...');
        // 此处编写任务提交前的业务逻辑（如果需要，不需要就不用重写此方法了）
        // alert('不允许提交');
        // return false;   // 返回false可阻止继续表单提交
    }

</script>
</body>
</html>